<template>
  <div class="static-page">
    <section class="hero">
      <h1>退换货政策</h1>
      <p>更清晰的流程，让退换无忧</p>
    </section>
    <section class="content">
      <div class="card">
        <h3>退换流程</h3>
        <ol>
          <li>提交申请并说明原因</li>
          <li>客服审核并提供邮寄信息</li>
          <li>寄回商品并保留快递单号</li>
          <li>完成退款或换货寄出</li>
        </ol>
      </div>
    </section>
  </div>
</template>

<style scoped>
.static-page .hero {
  padding: 40px 20px;
  text-align: center;
  background: linear-gradient(135deg, #f6f9ff, #eef5ff);
}
.static-page .hero h1 {
  margin: 0 0 8px;
  font-size: 28px;
  color: #1f2d3d;
}
.static-page .hero p {
  margin: 0;
  color: #666;
}
.static-page .content {
  max-width: 800px;
  margin: 20px auto 40px;
  padding: 0 20px;
}
.static-page .card {
  background: #fff;
  border: 1px solid #eef0f4;
  border-radius: 12px;
  padding: 20px;
}
ol {
  padding-left: 18px;
}
</style>
